<template>
    <div>
     <h1>会员信息添加</h1>
     <table class="table">
        <tbody>
             <tr>
                <td>姓名</td>
                <td><input type="text" v-model="data.name"></td>
             </tr>
             <tr>
                <td>性别</td>
                <td>
                    <input type="radio" v-model="data.sex" name="sex" value="1" checked>男
                    <input type="radio" v-model="data.sex" name="sex" value="2" >女
                </td>
             </tr>
             <tr>
                <td>年龄</td>
                <td><input type="text" v-model="data.age"></td>
             </tr>
             <tr>
                <td>生日</td>
                <td><input type="date" v-model="data.memberDate"></td>
             </tr>
             <tr>
                <td>状态</td>
                <td>
                    <input v-model="data.state" type="checkbox" checked> 选中为启用,未选中为禁用
                </td>
             </tr>  
             <tr>
                <td>爱好</td>
                <td>
                  <span v-for="e in hh">
                     <input v-model="h" type="checkbox" :value="e">{{ e }}
                  </span>
                </td>
             </tr>
             <tr>
                <td>会员等级</td>
                <td>
                    <select v-model="data.memberLevelId">
                        <option value="0">请选择会员等级</option>
                        <option v-for="e in xlk" :value="e.id">{{ e.levelName }}</option> 
                    </select>
                </td>
             </tr>
             <tr>
               <td colspan="2"><input type="button" value="添加" @click="add"></td>
             </tr>
        </tbody>
     </table>
    </div>
</template>

<script setup lang="ts">
import {ref,onMounted} from 'vue'
import axios from 'axios'
import { useRouter } from 'vue-router'

const router=useRouter();

const hh=ref(["画画","篮球","羽毛球","乒乓球"])

const h=ref([])

onMounted(()=>{
   xlks();
})

//下拉框
const xlk=ref([{
    "id": 1,
    "levelName": "白银会员"
}])
const xlks=()=>{
   axios.get("https://localhost:7048/api/Level",{params:xlk.value}).then(res=>{
     xlk.value=res.data;
   })
}

const data=ref({
  "id": 0,
  "name": "",
  "sex": 0,
  "age": "",
  "memberDate": "2025-04-22T09:25:35.970Z",
  "state": true,
  "isDeleted": true,
  "houbbyCount": 0,
  "houbbyString": "",
  "memberLevelId": 0
})

const add=()=>{
   data.value.houbbyCount=h.value.length;
   data.value.houbbyString=h.value.toString();
   axios.post("https://localhost:7048/api/Member/AddMember",data.value).then(res=>{
      if(res.data>0)
   {
     alert("添加成功")
     router.push({path:"/show"})
   }
   if(res.data==-1)
   {
      alert("名称重复")
      return;
   }
   if(res.data<0)
   {
     alert("添加失败")
     return;
   }
   })
}
 

</script>

<style scoped>

</style>